<template>
	<div v-if="tid==curtid">
		<div class="index__recommend__src-partition-recommend-">
			<div class="index__title__src-partition-recommend-">
				<p>热门推荐</p>
			</div>
			<a class="index__rank__src-partition-recommend-" href="/ranking.html?tid=1">
				<svg class="index__icon__src-partition-recommend- index__fill__src-partition-recommend-" aria-hidden="true">
					<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-paihangbang1"></use>
				</svg>
				<div class="index__words__src-partition-recommend-">
					<p>排行榜</p>
				</div>
				<div class="index__arrow__src-partition-recommend-">
					<svg class="index__icon__src-partition-recommend-" aria-hidden="true">
						<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-gengduo"></use>
					</svg>
				</div>
			</a>
			<div class="index__content__src-partition-recommend-">
				<router-link class="index__item__src-commonComponent-Item-" to="" v-for="(item,index) in hotlist" :key="index" v-if="index<4">
					<div class="index__imgContainer__src-commonComponent-Item-">
						<img src="//s1.hdslb.com/bfs/static/mult/images/tv.png" class="index__tv__src-commonComponent-Item-" alt="">
						<img v-lazy="item.pic+'@320w_200h.webp'" :alt="item.title" class="index__normal__src-commonComponent-Item-">
						<div class="index__info__src-commonComponent-Item-">
							<div class="index__playIcon__src-commonComponent-Item-">
								<svg class="index__icon__src-commonComponent-Item-" aria-hidden="true">
									<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-bofangshu"></use>
								</svg>
							</div>
							<div class="index__play__src-commonComponent-Item-">
								<p>{{floor(item.play)}}</p>
							</div>
							<div class="index__danmuIcon__src-commonComponent-Item-">
								<svg class="index__icon__src-commonComponent-Item-" aria-hidden="true">
									<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-danmushu"></use>
								</svg>
							</div>
							<div class="index__view__src-commonComponent-Item-">
								<p>{{floor(item.video_review)}}</p>
							</div>
						</div>
					</div>
					<div class="index__title__src-commonComponent-Item-">
						<p>{{item.title}}</p>
					</div>
				</router-link>
			</div>
		</div>
		<div class="index__different__src-partition-different-" v-for="(item,index) in showlist" :key="index">
			<div class="index__title__src-partition-different-">
				<p>{{item.typename}}</p>
			</div>
			<a class="index__more__src-partition-different-" href="/channel/24.html">
				<div class="index__words__src-partition-different-">
					<p>查看更多</p>
				</div>
				<div class="index__arrow__src-partition-different-">
					<svg class="index__icon__src-partition-different-" aria-hidden="true">
						<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-gengduo"></use>
					</svg>
				</div>
			</a>
			<div class="index__content__src-partition-different-">
				<router-link class="index__item__src-commonComponent-Item-" to="" v-for="(ite,ind) in contentlist" :key="ind" v-if="fu(item.typename,ite.typename)">
					<div class="index__imgContainer__src-commonComponent-Item-">
						<img src="//s1.hdslb.com/bfs/static/mult/images/tv.png" class="index__tv__src-commonComponent-Item-" alt="">
						<img v-lazy="ite.pic+'@320w_200h.webp'" :alt="ite.title" class="index__normal__src-commonComponent-Item-">
						<div class="index__info__src-commonComponent-Item-">
							<div class="index__playIcon__src-commonComponent-Item-">
								<svg class="index__icon__src-commonComponent-Item-" aria-hidden="true">
									<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-bofangshu"></use>
								</svg>
							</div>
							<div class="index__play__src-commonComponent-Item-">
								<p>{{floor(ite.video_review)}}</p>
							</div>
							<div class="index__danmuIcon__src-commonComponent-Item-">
								<svg class="index__icon__src-commonComponent-Item-" aria-hidden="true">
									<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-danmushu"></use>
								</svg>
							</div>
							<div class="index__view__src-commonComponent-Item-">
								<p>{{floor(ite.video_review)}}</p>
							</div>
						</div>
					</div>
					<div class="index__title__src-commonComponent-Item-">
						<p>{{ite.title}}</p>
					</div>
				</router-link>
			</div>
		</div>
	</div>
	<div v-else>
		<div class="index__recommend__src-partition-recommend-">
			<div class="index__title__src-partition-recommend-">
				<p>热门推荐</p>
			</div>
			<div class="index__content__src-partition-recommend-">
				<router-link class="index__item__src-commonComponent-Item-" to="" v-for="(item,index) in hotlist" :key="index" v-if="index<4">
					<div class="index__imgContainer__src-commonComponent-Item-">
						<img src="//s1.hdslb.com/bfs/static/mult/images/tv.png" class="index__tv__src-commonComponent-Item-" alt="">
						<img v-lazy="item.pic+'@320w_200h.webp'" :alt="item.title" class="index__normal__src-commonComponent-Item-">
						<div class="index__info__src-commonComponent-Item-">
							<div class="index__playIcon__src-commonComponent-Item-">
								<svg class="index__icon__src-commonComponent-Item-" aria-hidden="true">
									<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-bofangshu"></use>
								</svg>
							</div>
							<div class="index__play__src-commonComponent-Item-">
								<p>{{floor(item.play)}}</p>
							</div>
							<div class="index__danmuIcon__src-commonComponent-Item-">
								<svg class="index__icon__src-commonComponent-Item-" aria-hidden="true">
									<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-danmushu"></use>
								</svg>
							</div>
							<div class="index__view__src-commonComponent-Item-">
								<p>{{floor(item.video_review)}}</p>
							</div>
						</div>
					</div>
					<div class="index__title__src-commonComponent-Item-">
						<p>{{item.title}}</p>
					</div>
				</router-link>
			</div>
		</div>
		<div class="index__latest__src-partition-latest-">
			<div class="index__title__src-partition-latest-">
				<p>最新视频</p>
			</div>
			<div class="index__content__src-partition-latest-">
				<router-link class="index__item__src-commonComponent-Item-" to="" v-for="(item,index) in hotlist" :key="index" v-if="index<10">
					<div class="index__imgContainer__src-commonComponent-Item-">
						<img src="//s1.hdslb.com/bfs/static/mult/images/tv.png" class="index__tv__src-commonComponent-Item-" alt="">
						<img v-lazy="item.pic+'@320w_200h.webp'" :alt="item.title" class="index__normal__src-commonComponent-Item-">
						<div class="index__info__src-commonComponent-Item-">
							<div class="index__playIcon__src-commonComponent-Item-">
								<svg class="index__icon__src-commonComponent-Item-" aria-hidden="true">
									<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-bofangshu"></use>
								</svg>
							</div>
							<div class="index__play__src-commonComponent-Item-">
								<p>{{floor(item.play)}}</p>
							</div>
							<div class="index__danmuIcon__src-commonComponent-Item-">
								<svg class="index__icon__src-commonComponent-Item-" aria-hidden="true">
									<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#icon-danmushu"></use>
								</svg>
							</div>
							<div class="index__view__src-commonComponent-Item-">
								<p>{{floor(item.video_review)}}</p>
							</div>
						</div>
					</div>
					<div class="index__title__src-commonComponent-Item-">
						<p>{{item.title}}</p>
					</div>
				</router-link>
			</div>
			<div class="index__checkMore__src-partition-latest-">
				<p>点击加载更多</p>
			</div>
		</div>
	</div>
</template>

<script>
	import axios from "axios";
	import config from "@/config.js"
	let partitionList = window.__INITIAL_STATE__.reduxAsyncConnect.partitionList
	export default {
		name: 'fcontent',
		data() {
			return {
				tid: "",
				contentlist: [],
				showlist: [],
				hotlist: [],
				tidlist: []
			}
		},
		created() {
			this.tid = this.$route.params.tid
			this._getcontent()
			this.$store.commit('setcurtid', {
				curtid: this.$route.params.tid
			})
			this.curtid = this.$store.getters.getcurtid;
			if(this.$route.params.tid == this.curtid) {
				this.showlist = partitionList[this.$route.params.tid]
				this._getcontent()
				this._gettid()
			}
		},
		methods: {
			_list(tidlist) {
//				console.log(tidlist)
				axios.get('/region', {
					params: {
						rid: tidlist
					}
				}).then((res) => {
					res.data.data.splice(0, 4).forEach((el, index) => {
						this.contentlist.push(el)
					})
				})
			},
			_gettid() {
				this.contentlist = [];
				this.tidlist = [];
				partitionList[this.$route.params.tid].forEach((el, index) => {
					this.tidlist.push(el.tid)
				})
				this.tidlist.forEach((el, index) => {
					this._list(el)
				})
			},
			_getcontent() {
				this.hotlist = [];
				axios.get('/region', {
					params: {
						rid: this.tid
					}
				}).then((res) => {
					res.data.data.forEach((el, index) => {
						this.hotlist.push(el)
					})
				})
			},
			floor(el) {
				return el > 10000 ? (el / 10000).toFixed(1) + "万" : el
			},
			fu(a, b) {
				return a == b
			}
		},
		computed: {

		},
		watch: {
			$route(newValue) {
				this.tid = newValue.params.tid
				this.showlist = partitionList[newValue.params.tid]
				this._getcontent()
				this.$store.commit('setcurtid', {
					curtid: this.$route.params.tid
				})
				this.curtid = this.$store.getters.getcurtid;
				if(newValue.path.indexOf("channel") > 0 && newValue.params.tid == this.curtid) {
					this._gettid()
				}
			}
		}
	}
</script>

<style></style>